<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
    <div>box</div>
    <script>
        // 3. await后面的Promise对象，运行结果可能是rejected，那么会报错
        //     1. 报错了后面就不会执行了
        //     2. 所以最好把await命令放在try...catch代码块中。

        async function fn(){
            await Promise.reject('出错了') // await出错了，下面就不会执行了
            await Promise.resolve('hello')
        }

        // fn().then(res => {
        //     console.log(res)
        // })

        try {
            // 把可能出错的代码，放在这里
            const box = document.querySelector('.div')
            box.innerHTML = 'wahh'
            console.log(box)
        } catch(err) {
            // 一旦try中的代码，出错了，报错了，都会捕获到这里，并且控制台不会打印错误
            console.log(err)
        }
        // console.log(123123)


        // 应用 try-catch 
        async function fn(){
            try {
                await Promise.reject('出错了') // await出错了，下面就不会执行了
            } catch(err) {
                console.log(err)
            }
            // async 函数， 里面如果没有return，fn()执行完，结果是成功态的undefined
            
            return await Promise.resolve('hello')
            // return 'hello'
            // return 666
        }

        fn().then(res => {console.log(res)})
    </script>
</body>
</html>